<template>
  <div>
    <el-col :span="24" class="bg1">
      <div class="grid-content bg-purple">
        <FormPanel ref="formPanel" :list="formList" :cols="3" :labelWidth="110" :isSubmitBtn="false"/>
      </div>
    </el-col>

    <el-col :span="24" class="bg2">
      <BreakSpace
        :labelStyle="{fontSize:'12px'}"
        label="家用汽车产品自销售者开具购车发票之日起2年内或者行驶里程50000公里之内(以先到者为准),转向系统、制动系统、悬架系统、前/后桥、车身的同一主要零件因其质量问题，累计更换2次后，仍不能正常使用的,销售者应当负责免费更换或退货.(有折旧补偿)"
        :containerStyle="{ marginBottom: '0px' }"></BreakSpace>
      <FilterTable
        ref="tableZCheng"
        selectionType="single"
        :isSelectColumn="false"
        :columns="columns"
        :isMemoryPagination="true"
        height="200"
        columnsRef="glqzongchengTable"
        :isColumnFilter="true"
        :onColumnsChange="columns => (this.columns = columns)"
        :onRowSelectChange="arr => (this.onChangeColumn = arr)"
      >
      </FilterTable>
    </el-col>

    <el-col :span="24" class="bg2">
      <BreakSpace
        :labelStyle="{fontSize:'12px',paddingLeft:'10px'}"
        label="在家用汽车产品三包有效期内，因产品质量问题修理时间累计超过35日,消费者可以凭三包凭证、购车发票，由销售者负责更换.(有折旧补偿)"
        :containerStyle="{ marginBottom: '0px'}"></BreakSpace>
      <FilterTable
        ref="tableVin"
        selectionType="single"
        :isSelectColumn="false"
        :columns="columns2"
        height="200"
        :isMemoryPagination="true"
        :isColumnFilter="true"
        :onColumnsChange="columns => (this.columns2 = columns)"
        :onRowSelectChange="arr => (this.onChangeColumn = arr)"
      >
      </FilterTable>
    </el-col>

    <el-col :span="24" class="bg2">
      <BreakSpace
        :labelStyle="{fontSize:'12px'}"
        label="在家用汽车产品三包有效期内,因同一产品质量问题累计修理超过5次,消费者可以凭三包凭证、购车发票，由销售者负责更换.(有折旧补偿)"
        :containerStyle="{ marginBottom: '0px' }"></BreakSpace>
      <FilterTable
        ref="tablePeij"
        selectionType="single"
        :isSelectColumn="false"
        :columns="columns3"
        :isMemoryPagination="true"
        height="200"
        :isColumnFilter="true"
        :onColumnsChange="columns => (this.columns3 = columns)"
        :onRowSelectChange="arr => (this.onChangeColumn = arr)"
      >
      </FilterTable>
    </el-col>

    <div class="dialogBottmView">
      <el-button size="small" type="primary" class="btnStyle" @click="closeMenu('2')">关闭
      </el-button>
    </div>
  </div>
</template>

<script>
  import {getParaItem} from '@/api/repair/threePacksOfManager/warningQueryJingxsDuan';

  import {dictionary} from '@/utils/dictMixin';
  import {isEmpty} from '@/utils/utils';
  import {exportExcelFile} from '@/utils/index';

  export default {
    name: 'detail',
    mixins: [dictionary],
    props: ['handleType', 'vinId'],
    data()
    {
      this.saveData = null;
      return {

        formList: this.createFormList(),
        columns: this.createTableColumns(),
        columns2: this.createTableColumns2(),
        columns3: this.createTableColumns3(),
        detailObj: {},
      };
    },
    components: {},
    mounted()
    {
      this.BaseTableZCengTable = this.$refs.tableZCheng.$refs.pageTable;
      this.BaseSportVin = this.$refs.tableVin.$refs.pageTable;
      this.BasePeijTable = this.$refs.tablePeij.$refs.pageTable;
      this.getData();

    },
    methods: {

      /*根据ID查询*/
      async getData()
      {
        let res = await getParaItem({'id': this.vinId});

        if (res.resultCode == 200 && res.success == true)
        {
          let data = isEmpty(res['data']) ? {} : res['data'];

          let vinPartDTOS = isEmpty(data['vinPartDTOS']) ? [] : data['vinPartDTOS'];

          let vinAssemblyDTOS = isEmpty(data['vinAssemblyDTOS']) ? [] : data['vinAssemblyDTOS'];

          this.BaseTableZCengTable.EXECUTE_INSERT(vinAssemblyDTOS);

          this.BasePeijTable.EXECUTE_INSERT(vinPartDTOS);


          let vinParams = {
            license: isEmpty(data['license']) ? '' : data['license'],
            vin: isEmpty(data['vin']) ? '' : data['vin'],
            totalRepairTime: isEmpty(data['totalRepairTime']) ? '' :( parseFloat(data['totalRepairTime'])/24)
          }

          this.BaseSportVin.EXECUTE_INSERT([vinParams]);


          for (let i in data)
          {
            this.formList.map(x =>
            {
              if (i == x.fieldName)
              {
                x.initialValue = data[i];
              }
            });
          }
        }

      },
      async closeMenu(type)
      {
        this.$emit('close')
      },
      createTableColumns()
      {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 70,
            sorter: true,
            fixed: 'left',
            render: props =>
            {
              return <span>{props.row.index + 1}</span>;
            }
          },
          {
            title: '总成代码',
            dataIndex: 'assemblyCode',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input',

          },
          {
            title: '总成名称',
            dataIndex: 'assemblyName',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input',

          },
          {
            title: '当前次数',
            dataIndex: 'repairCount',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input',
          },

          {
            title: '法定次数',
            dataIndex: 'legalCount',
            sorter: true,
            filter: true,
            filterType: 'input',
          },
        ];
      },

      createTableColumns2()
      {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 70,
            sorter: true,
            fixed: 'left',
            render: props =>
            {
              return <span>{props.row.index + 1}</span>;
            }
          },
          {
            title: '车牌号',
            dataIndex: 'license',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input',

          },
          {
            title: 'VIN',
            dataIndex: 'vin',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input',

          },
          {
            title: '维修天数',
            dataIndex: 'totalRepairTime',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input',
            precision:2
          },

          {
            title: '法定天数',
            dataIndex: 'remarks',
            sorter: true,
            filter: true,
            filterType: 'input',
          },
        ];
      },
      createTableColumns3()
      {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 70,
            sorter: true,
            fixed: 'left',
            render: props =>
            {
              return <span>{props.row.index + 1}</span>;
            }
          },
          {
            title: '零件代码',
            dataIndex: 'partNo',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input',

          },
          {
            title: '零件名称',
            dataIndex: 'partName',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input',

          },
          {
            title: '当前次数',
            dataIndex: 'repairCount',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input',
          },

          {
            title: '法定次数',
            dataIndex: 'legalCount',
            sorter: true,
            filter: true,
            filterType: 'input',
          },
        ];
      },
      createFormList()
      {

        return [
          {
            type: 'BREAK_SPACE',
            label: '客户三包信息',
          },

          {
            type: 'INPUT',
            label: 'VIN',
            fieldName: 'vin',
            itemList: [],
            disabled: true,
            placeholder: '',
            // rules: [{required: true, trigger: 'change'}],
            initialValue: ''
          },
          {
            type: 'INPUT',
            label: '车牌号',
            fieldName: 'license',
            disabled: true,
            rules: [{required: false, trigger: 'change'}],
            placeholder: '请输入',
            initialValue: ''
          },
          {
            type: 'INPUT',
            label: '车主姓名',
            fieldName: 'ownerName',
            placeholder: '',
            disabled: true,
            rules: [{required: false, trigger: 'change'}],
            initialValue: '',

          },
          {
            type: 'INPUT',
            label: '行驶里程',
            fieldName: 'mileage',
            placeholder: '请选择',
            disabled: true,
            rules: [{required: false, trigger: 'change'}],
            initialValue: '',
          },
          {
            type: 'INPUT',
            label: '累计维修耗时',
            fieldName: 'totalRepairTime',
            placeholder: '请选择',
            disabled: true,
            initialValue: '',
          },
          {
            type: 'INPUT',
            label: '联系人',
            fieldName: 'linkName',
            placeholder: '请选择',
            disabled: true,
            initialValue: '',
          },
          // {
          //   type: 'INPUT',
          //   label: '邮编',
          //   fieldName: 'counts3',
          //   placeholder: '请选择',
          //   disabled: true,
          //   rules: [{required: false, trigger: 'change'}],
          //   initialValue: '',
          // },
          {
            type: 'INPUT',
            label: '联系电话',
            fieldName: 'linkTel',
            placeholder: '请选择',
            disabled: true,
            rules: [{required: false, trigger: 'change'}],
            initialValue: '',
          },

        ];
      },
    }
  };
</script>

<style scoped lang="less">
  .bg1 {
    border: 1px solid @borderColor;
    border-radius: @borderRadius;
    box-shadow: @boxShadow;
    padding: @modulePadding;
    padding-left: 0;
    padding-top: 15px;
    padding-bottom: 15px;
  }

  .bg2 {
    margin-top: 10px;
    margin-bottom: 10px;
  }

  .btn {
    text-align: center;
  }

  .btnStyle {
    margin-top: 10px;
  }
</style>
